<template>
	<div class="select-none">
		<div class="flex-c absolute right-5 top-3"></div>
		<div
			class="login-container relative flex items-center justify-end pr-[150px]"
		>
			<div class="login-box">
				<div class="login-form pl-[72px] pr-[61px] pt-[20px]">
					<div class="login-title">
						<div class="flex items-center justify-center mb-8">
							<img class="lo-l1" src="/@/assets/logo4.png" alt="" />
						</div>
						<img src="/@/assets/logo3.png" alt="" />
					</div>
					<!-- 用户名密码登录 -->
					<Password @signInSuccess="signInSuccess" />
				</div>
			</div>
		</div>
	</div>
</template>

<script setup lang="ts" name="loginIndex">
import { NextLoading } from '/@/utils/loading';
import { useI18n } from 'vue-i18n';
import { formatAxis } from '/@/utils/formatTime';
import { useMessage } from '/@/hooks/message';
import { Session } from '/@/utils/storage';
import { initBackEndControlRoutes } from '/@/router/backEnd';

// 引入组件
const Password = defineAsyncComponent(() => import('./component/password.vue'));

// 定义变量内容
const { t } = useI18n();
const route = useRoute();
const router = useRouter();

// 登录成功后的跳转处理事件
const signInSuccess = async () => {
	const isNoPower = await initBackEndControlRoutes();
	if (isNoPower) {
		useMessage().wraning('抱歉，您没有登录权限');
		Session.clear();
	} else {
		// 初始化登录成功时间问候语
		let currentTimeInfo = formatAxis(new Date());
		if (route.query?.redirect) {
			router.push({
				path: <string>route.query?.redirect,
				query:
					Object.keys(<string>route.query?.params).length > 0
						? JSON.parse(<string>route.query?.params)
						: '',
			});
		} else {
			router.push('/');
		}
		// 登录成功提示
		const signInText = t('signInText');
		useMessage().success(`${currentTimeInfo}，${signInText}`);
		// 添加 loading，防止第一次进入界面时出现短暂空白
		NextLoading.start();
	}
};

// 页面加载时
onMounted(() => {
	NextLoading.done();
});
</script>
<style lang="scss" scoped>
.lo-l1 {
	width: 80px;
	height: 80px;
}
</style>
